<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 数据代理：通过一个对象代理对另一个对象中属性的操作（读/写）
        let obj = {}
        let obj2 = {
            x:100,
            y:100
        }

        // data(){
        //     return {
        //         msg:'123'
        //     }
        // }
        // data = vm._data = {msg:'123'}
        // this.msg  vm._data.msg  vm.$data.msg 

        // ==> this.msg 

        // obj本身没有x属性
        // 我想 读取obj.x 的时候，访问到obj2.x 
        //     设置obj.x 的时候，设置obj2.x 
        Object.defineProperty(obj, 'x', {
            get(){
                return obj2.x
            },
            // obj.x = '123'
            set(newVal){
                obj2.x = newVal
            }
        })

        // 相当于用 obj 去代理 对 obj2中x的属性操作
    </script>
</body>
</html>